<template>
	<view class="operate-platform-table">
		<view class="operate-platform-box card">
			<view class="head">
				<view class="tit">操作日志</view>
				<view class="right">
					<!-- <view @click="earlyWarn">预警信息</view> -->
					<!-- <view class="more" @click="toMore">更多</view> -->
					<!-- <view class="expand" @click="telescopic">{{isExpand ? '展开':'收起' }}</view> -->
				</view>
			</view>
			<view class="table">
				<uni-table emptyText="暂无更多数据">
					<uni-tr class="tr">
						<uni-th style="width:140rpx;" class="th" align="left">用户</uni-th>
						<uni-th style="width:180rpx;" class="th" align="left">模块</uni-th>
						<uni-th style="width:138rpx;" class="th" align="left">日志内容</uni-th>
						<uni-th class="th" align="left">操作时间</uni-th>
					</uni-tr>
					<uni-tr class="tr" v-for="(archive, index) in list" :key="index">
						<uni-td class="td">{{ archive.nickName }}</uni-td>
						<uni-td class="td">{{ archive.moduleName || '--' }}</uni-td>
						<uni-td class="td">
							<text :style="{ color: handleTypeMap[archive.handleType].color }">{{
							handleTypeMap[archive.handleType].text }}</text>
						</uni-td>
						<uni-td class="td">{{ archive.createTime }}</uni-td>
					</uni-tr>
				</uni-table>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		handleTypeMap
	} from '@/const/archives'
	export default {
		name: 'OperatePlatformTable',
		props: {
			list: {
				type: Array,
				default: () => []
			},
			params: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				handleTypeMap,
				isExpand: true
			}
		},
		methods: {
			/* 跳转到 消息列表 */
			toMore() {
				uni.navigateTo({
					url: `/pages/sys/msg/index?archivesName=${this.params.name}`
				});
			},
			/* 跳转到 预警信息列表 */
			earlyWarn() {
				uni.navigateTo({
					url: '/pagesA/early_warn/index'
				});
			},
			telescopic() {
				this.$emit('expand', this.isExpand)
				this.isExpand = !this.isExpand
			}
		}
	}
</script>

<style scoped lang="scss">
	.operate-platform-box {
		padding: 0 38rpx;

		.head {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 22rpx 0 24rpx;
			background-color: #fff;

			.tit {
				display: flex;
				align-items: center;
				font-size: 36rpx;
				font-weight: bold;
			}

			.right {
				display: flex;
				color: $main-color;

				.more {
					margin-right: 20rpx;
				}
			}
		}

		::v-deep .uni-table {
			min-width: 740rpx !important;
			transition: height 0.3s;
		}

		.table {
			.tr {
				.th {
					color: #000000;
					background-color: #fafafa;
					padding-top: 17rpx;
					padding-bottom: 17rpx;
				}

				.td {
					color: #000000a6;
					padding-top: 15rpx;
					padding-bottom: 15rpx;
				}

				.td,
				.th {
					&:first-of-type {
						padding-left: 50rpx;
					}

					input {
						font-size: 22rpx;
					}

					font-size: 22rpx;
				}
			}
		}
	}
</style>